<template lang="html">
  <div class="day-trade">
    <query-modal
      :show-query-modal.sync="showQueryModal"
      :params.sync="params"
      :statement-type="'productTrade'"
      ></query-modal>
    <table class="table table-bordered table-hover">
      <caption>产品交易用户</caption>
      <thead>
        <tr>
          <th class="col-xs-1">日期</th>
          <th class="col-xs-1">券商</th>
          <th class="col-xs-1">组合</th>
          <th class="col-xs-1">点击交易次数</th>
          <th class="col-xs-1">点击交易用户数</th>
          <th class="col-xs-1">委托交易用户数</th>
        </tr>
      </thead>
      <tbody>
        <tr v-for="item in list">
          <td class="col-sm-1">
            {{item.period}}
          </td>
          <td class="col-sm-1">
            {{item.securityCompanyName}}
          </td>
          <td class="col-sm-1">
            {{item.productName}}
          </td>
          <td class="col-sm-1">
            {{item.clickTradeCount}}
          </td>
          <td class="col-sm-1">
            {{item.clickTradeUserCount}}
          </td>
          <td class="col-sm-1">
            {{item.tradeUserCount}}
          </td>
        </tr>
      </tbody>
    </table>
  </div>
</template>

<script src="./product-trade.js"></script>
<style src="./product-trade.css" scoped></style>
